<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%
	String path = request.getContextPath();
%>
<%@taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="copyright" content="Tencent"/>
    <meta name="keywords" content=""/>
    <meta name="description" content=""/>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="format-detection" content="telephone=no">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0,user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
	<title>參加活动成功</title>
    <link href="<%=path%>/favicon.ico" rel="shortcut icon">
    <link href="https://cdn.jsdelivr.net/gh/bootcdn/BootCDN/ajax/libs/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
	<link rel="stylesheet" type="text/css" href="<%=path%>/css/marketing/public.css" />
	<link rel="stylesheet" type="text/css" href="<%=path%>/css/marketing/marketing.css" />
	<style>
    	.s_bg{
			background:url(<%=path%>/images/marketing/activity_success_bg.png) no-repeat;
			background-size:100% 100%;
		}
    </style>
</head>
<body class="s_activity_body" style="background:#fff">
    <div class="k_phone" id="qy_card" style="height:100%;">
        <div class="s_bg" style="padding:30px 20px 20px 20px">
            <p id="successHintPreview" class="text-center" style="color:white;font-size:16px;">恭喜您成功参与本次活动</p>
            <div id="successExplainPreview" style="padding:20px;color:white;font-size:14px;">请持续关注我们的活动，更多惊喜等你来！</div>
            <div style="text-align:center">
               <button id="btnShowCouponList" class="btn btn-w-m btn-white" style="background-color:#ffffff">点击查看券列表</button>
            </div>
            
        </div>
        <div id="recommendActivityPreview" class="col-md-12" style="margin-top:15px;padding:0px" hidden="">
            <div class="k_cut kkkk" id="info3">
			   <h1><p>推荐活动</p><i></i></h1>
			   <ul class="surrent" id="recommendActivityList">
			   </ul>
			</div>
        </div>
        
        <div id="qrcodePreview" class="col-md-12 text-center" align="center" style="text-align:center;position: absolute;bottom: 0;width:100%" hidden="">
                <h6 id="qrcodeHintPreview">长按识别二维码</h6>
                <img  class="qrcodeImg" style="width:80px;height:80px;margin-top:5px" src="<%=path%>/images/marketing/icon_wb.png">
                <p class="k_footer">zhfeat提供技术服务</p>
        </div>
        
    </div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.qrcode/1.0/jquery.qrcode.min.js"></script>
<script type="text/javascript" src="<%=path%>/js/marketing/qrcode.js"></script>
<script src="http://pv.sohu.com/cityjson?ie=utf-8"></script>
<script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
<script src="<%=path%>/js/marketing/public.js"></script>

<script type="text/javascript">
var cid="";
var path = "<%=path%>";
var activityId="";
var successTip="";
var successDescription="";
var listButtonText="";
var isShowCouponList=true;
var recommendActivityIds="";
var isShowRecommendActivity=false;
var isShowQrcode=false;
var qrcodeTip="";
var bgPic="";
var qrcodePic="";
var id="";
var customerId="";
var couponBatch="0";
var join = ""; // 是否参加活动 isJoin : 参加

$(function(){
	activityId=getQueryString("activityId");
	customerId=getQueryString("customerId");
	couponBatch=getQueryString("couponBatch");
	cid=getQueryString("cid");
    join=getQueryString("join");
    getDetail();
    hint_message();
});

//获取详情
function getDetail(){
	var url = "<%=path%>/activitySuccessPage/ajaxDetailByActivityId";
	$.post(url, {
		"cid" : cid,
		"activityId" : activityId,
	}, function(data) {
		console.log(data);
		if (data.status == 200) {
			initHtml(data.data);
            hint_message();
			var recommendActivityData=data.recommendActivityData;
			if(recommendActivityData != null && recommendActivityData.length>0){
				initRecommendActivity(recommendActivityData);
			}
		} else {
			
		}
	});
}
//初始化页面
function initHtml(data){
	 id=data.id;
	 successTip=data.successTip;
	 successDescription=data.successDescription;
	 listButtonText=data.listButtonText;
	 isShowCouponList=data.isShowCouponList;
	 recommendActivityIds=data.recommendActivityIds;
	 isShowRecommendActivity=data.isShowRecommendActivity;
	 isShowQrcode=data.isShowQrcode;
	 qrcodeTip=data.qrcodeTip;
	 bgPic=data.bgPic;
	 qrcodePic=data.qrcodePic;
	 
	 if(StringEmpty(successTip)){
		 $('#successHintPreview').html(successTip);
	 }
	 if(StringEmpty(successDescription)){
		 $('#successExplainPreview').html(successDescription);
	 }
	 if(StringEmpty(listButtonText)){
		 $('#btnShowCouponList').html(listButtonText);
	 }
	 $('#qrcodeHint').val(qrcodeTip);
	 $('#qrcodeHintPreview').html(qrcodeTip);
	 
	 if(StringEmpty(bgPic)){
		 $(".s_bg").css("background-image", "url(" + bgPic + ")");
	 }
	 if(StringEmpty(qrcodePic)){
		 $('.qrcodeImg').attr("src",qrcodePic);
	 }
	 //判断是否显示券列表按钮
	 if(isShowCouponList){
		 $('#btnShowCouponList').show();
	 }else{
		 $('#btnShowCouponList').hide();
	 }
	 if(isShowRecommendActivity){
		 $('#recommendActivityPreview').show();
	 }else{
		 $('#recommendActivityPreview').hide();
	 }
	 if(isShowQrcode){
		 $('#qrcodePreview').show();
	 }else{
		 $('#qrcodePreview').hide();
	 }
	 
}

    //用户参与过活动后，提示文案
    function hint_message(){
        if (join=="isJoin"){
            $("#successHintPreview").html("您已经参加过此次活动");
            $("#successExplainPreview").html("感谢您此次的参与，持续关注我们，获取更多活动");
        }
    }


function initRecommendActivity(recommendActivityData){
	var html='';
	for(var i in recommendActivityData){
		html+='<a href="'+recommendActivityData[i].web_url+'" style="display:block;">';
		html+='<div class="k_content" id="chu300">';
		html+='<dl class="fix">';
		html+='<div style="border-bottom: 1px solid #eee;height: 105px;">';
		html+='<dt><img style="width:72px; height:72px;" src="'+recommendActivityData[i].pic+'"></dt>';
		html+='<dd style="margin-left: -14px;">';
		html+='<p style="color: #03a9f4;">'+recommendActivityData[i].name+'</p>';
		html+='<i class="s_md" style="overflow:hidden;text-overflow:ellipsis;display:-webkit-box;&nbsp;-webkit-box-orient:vertical;-webkit-line-clamp:3;&nbsp;">'+recommendActivityData[i].content+'</i>';
		html+='</dd></div></dl></div></a>';  
	}
	$('#recommendActivityList').html(html);
}
$(document).on('click', '#btnShowCouponList', function() {
	 if(StringEmpty(couponBatch)){
		 window.location.href="<%=path%>/view/ui/mobileCoupon?cid="+cid+"&couponBatch="+couponBatch+"&customerId="+customerId;
	 }else{
		 window.location.href="<%=path%>/view/ui/mobileCoupon?cid="+cid+"&couponBatch=0"+"&customerId="+customerId;
	 }
	
	  
});   
    
    

</script>
</body>
</html>
